¡Hola 👋! Espera mientras comienza la sesión.

Antes que todo, ¿cómo están?

Visualización de Información

IIC2026 2021-2

Zooming y panning en D3.js

Visualización de Información

IIC2026 2021-2

Contenido

Contenido


1. d3-zoom

2. Zoom sobre idioms I

3. Zoom sobre idioms II

¡Actividad grupal!

Cada grupo asignado a una Sala de Zoom debe completar en conjunto un programa de JavaScript que extiende un documento HTML. Los objetivos a lograr como grupo son:

  • Escribir una lista no ordenada en el documento HTML con los nombres de las personas que forman el grupo.
  • Completar un programa con puntos conectados por líneas que ya hemos visto, y agregarle comportamiento de zoom horizontal..
  • Que entiendan el funcionamiento del programa. Llamen a alguien del equipo docente para preguntar las partes que no entienden.
  • Llegen lo más lejos posible como grupos, está OK no terminar el objetivo hoy :)

¡Actividad grupal!


Les recomendamos que por grupo asignen:

  • Al menos una persona que tenga el material del curso y documentación de D3.js a mano para consultarla.
  • Al menos una persona pendiente de las dudas que surjan para solicitar ayuda durante la actividad.
  • Al menos una persona que se encargue de escribir y extender el documento HTML y programa JavaScript.
  • El resto puede apoyar a quienes escriban o a otros roles.

¡Actividad grupal!


Para colaborar en el código, pueden:

El equipo docente les preparó salas en Coding Rooms. Para ingresar y colaborar deben entrar a un enlace y luego:

  1. Por defecto, entrarán a la sala solo con permiso de lectura, por lo que un ayudante les asignará el rol de editor a les primeres que entren.
  2. Si ya tienen rol de editor, pueden darle este rol a otros estudiantes. Para ello:
    1. Presionen el botón ‘Share’ en la parte superior derecha.
    2. En el cuadro desplegado, cambia el rol de todes les ‘Viewer’ a ‘Editor’ (Si no salen en el cuadro desplegado, recarguen la página)
  3. Para poder ver cómo va quedando su código, despliguen la vista de navegador en el botón ‘View Webpage’ de la parte inferior derecha.
  4. ¡Listo! Ya pueden ponerse a trabajar conjuntamente en su HTML y SVG.

¡Actividad grupal!

Salas y documentos asignados:

Resultados de actividad grupal

¡Visualización del día!

Cambios en vivo sobre Wikipedia mediante sonido.

Propuesta por entidad anónima.

(Fuente: Listen to Wikipedia)

Próximos eventos:


Hoy (20:00) es la entrega del Entrega 2.


Hasta viernes 08 de octubre se puede responder Encuesta Medio Semestre.


Se vienen sesiones sobre: Visualización de datos espaciales (martes 12) y Facet (jueves 14).

Zooming y panning en D3.js

Visualización de Información

IIC2026 2021-2


¡Deja tus preguntas en los comentarios!